/**
 * Created by Scott on 2017/3/28.
 */
import React from 'react';
import { Table, Input } from 'antd';
import Schema from './Schema';
import  './index.less';
import reqwest from 'reqwest';
import js_date_time from '../../utils/DateFormat';
class Generator extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      data: [],
      pagination: {},
      schemas: [],
      schemaSelect: 'sgms',
      loading: false,
      tableSelect: '',
      selectedRow: [],
    };
  }


  /**
   * 页面初始化获取数据
   */
  componentWillMount() {
    this.initSchemaList();
    this.querySchema();
  }

  /**
   * 初始化左侧数据表
   */
  initSchemaList = ()=> {
    reqwest({
      method: "get",
      url: "/api/schema/findAll",
      type: 'json'
    }).then((data)=> {
      this.setState({
        loading: false,
        schemas: data.data
      });
    });
  };

  /**
   * 根据表名模糊过滤
   * @param params
   */
  querySchema = (pager = { size: 10, page: 1 }) => {
    this.setState({ loading: true });
    const queryParams = {
      mapParams: { dbName: this.state.schemaSelect, tableName: this.state.tableSelect },
      page: pager.page,
      size: pager.size
    };
    reqwest({
      url: '/api/schema/query',
      method: 'post',
      data: JSON.stringify(queryParams),
      contentType: "application/json; charset=utf-8",
      type: 'json'
    }).then((data) => {
      const pagination = { ...this.state.pagination };
      pagination.total = data.total;
      this.setState({
        loading: false,
        data: data.data,
        pagination,
      });
    });
  };

  schemaSelect = (select) => {
    this.setState({ schemaSelect: select.key, selectedRow: [] });
    this.querySchema({
      pager: {
        size: this.state.pagination.pageSize,
        page: this.state.pagination.current
      }
    });
  };

  /**
   * 分页按钮事件
   * @param pagination
   */
  handleTableChange = (pagination) => {
    const pager = { ...this.state.pagination };
    pager.current = pagination.current;
    this.setState({
      pagination: pager
    });
    this.querySchema({
      pager: {
        size: pagination.pageSize,
        page: pagination.current
      }
    });
  };

  searchSchemaTable = (e)=> {
    const { value } = e.target;
    e.persist();
    this.setState({
      tableSelect: value
    });
    this.querySchema({
      pager: {
        size: this.state.pagination.pageSize,
        page: this.state.pagination.current
      }
    });
  };

  // exportSrc = ()=> {
  //   const tableNames = new Array();
  //   Object
  //     .keys(this.state.selectedRow)
  //     .map(key =>tableNames.push(this.state.selectedRow[key]));
  //   this.setState({ exportUrl: '../api/generatorCode?dbName=' + this.state.schemaSelect + '&tableNames=' + JSON.stringify(tableNames) });
  //   console.log(tableNames);
  //   // reqwest({
  //   //   url: '/api/generatorCode?dbName=' ,
  //   //   method: 'post',
  //   //   data: JSON.stringify(tableNamse),
  //   //   contentType: "application/json; charset=utf-8",
  //   //   type: 'json'
  //   // }).then((data) => {
  //   //
  //   // });
  //   // console.log('导出');
  // };

  render() {
    const columns = [{
      title: '表名',
      dataIndex: 'tableName',
      key: 'tableName',
    }, {
      title: '引擎',
      dataIndex: 'engine',
      key: 'engine',
    }, {
      title: '表描述',
      dataIndex: 'tableComment',
      key: 'tableComment',
    }, {
      title: '创建时间',
      dataIndex: 'createTime',
      key: 'createTime',
      render: createTime =>js_date_time(createTime)
    },{
      title:'操作',
      dataIndex:'tableName',
      key:'operation',
      render:tableName=><a href={'http://localhost:7070/generatorCode?dbName=' + this.state.schemaSelect + '&tableName=' + tableName }>导出</a>
    }];


    return (
      <div className="main">
        <Schema className="schema" menuDate={this.state.schemas} onClick={this.schemaSelect}/>
        <div className="generator-table">
          <div className="components-table-demo-control-bar">
            <Input
              placeholder="input search text"
              style={{ width: 200 ,margin:10}}
              onPressEnter={this.searchSchemaTable}
            />
            <Table rowKey={record => record.tableName}  loading={this.state.loading}
                   dataSource={this.state.data} columns={columns}
                   onChange={this.handleTableChange} pagination={this.state.pagination}
            >
            </Table>
          </div>
        </div>
      </div>
    );
  }
}


export
default
Generator;